<template>
  <div class="order-search">
    <BreadCrumb title="订单查询"></BreadCrumb>
    <div class="order-search-content">
      <el-card>
        <div class="order-search-item" v-if="orderDetailsList.length">
          <OrderCard   v-for="item in orderDetailsList" :orderItem="item" :key="item.roomId">
          </OrderCard>
        </div>
        <template v-else>
          <el-empty description="订单为空"></el-empty>
        </template>
      </el-card>
    </div>
  </div>
</template>

<script>
// import { orderList, searchOrder } from '@/api/order'
import OrderCard from '@/components/user/OrderCard.vue'
import BreadCrumb from '@/components/user/BreadCrumb.vue'
// import store from '@/store'
import { mapState } from 'vuex'
export default {
  name: 'BuyRoomIndex',
  components: {
    BreadCrumb,
    OrderCard
  },
  data () {
    return {
    }
  },
  computed: {
    ...mapState('order', ['orderDetailsList'])
  },
  created () {
    this.$store.dispatch('order/getOrderListAction')
  },
  mounted () {
    console.log(this.orderDetailsList)
  },
  methods: {
  }
}
</script>

<style lang="less" scoped>
.order-search-content{
  display: flex;
  justify-content: center;
}
.el-card{
  width: 94%;
}
</style>
